<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
	    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
		<meta name="csrf-token" content="{{ csrf_token() }}">
		<title>Login</title>
		<link rel="stylesheet" href="{{asset('resources/plugins/elementui/element-ui/lib/theme-chalk/index.css')}}">
		<link rel="stylesheet" href="{{asset('public/static/common/css/bootstrap.min.css')}}">
		<link rel="stylesheet" href="{{asset('public/static/common/css/animate.min.css')}}">
		<link rel="stylesheet" href="{{asset('public/static/common/css/font-awesome.min.css')}}">
		<link rel="stylesheet" href="{{asset('public/static/admin/css/style.min.css')}}">
		<link rel="stylesheet" href="{{asset('public/static/admin/css/reset.css')}}">
		<link rel="stylesheet" href="{{asset('public/static/admin/css/login.css')}}">
		<script src="{{asset('public/static/common/js/jquery.min.js')}}"></script>
		<script src="{{asset('resources/plugins/elementui/vue/vue.js')}}"></script>
		<script src="{{asset('resources/plugins/elementui/element-ui/lib/index.js')}}"></script>
	</head>
	<body>
		@csrf
		<div id="main" @keydown="enterLogin">
			<el-row>
				<el-col :md="6" class="offset">-</el-col>
				<el-col :md="12" class="signin">
					<el-row :gutter="20">
						<el-col :md="12" class="welcome-msg">
							<h4>欢迎使用 FAdmin系统</h4>
						</el-col>
						<el-col :md="12">
							<el-form ref="form" :model="form" class="loginForm">
								<p :class="tipsClass">@{{ tips }}</p>
								<el-form-item>
									<el-input v-model="form.username" placeholder="用户名"></el-input>
								</el-form-item>
								<el-form-item>
									<el-input v-model="form.passwd" type="password" placeholder="密码"></el-input>
								</el-form-item>
								<el-form-item class="code-input">
									<el-input v-model="form.code" placeholder="验证码"></el-input>
								</el-form-item>
								<el-form-item class="code-img">
									<img id="codeImg" :src="code_img_src" @click="changeVerify">
								</el-form-item>
								<el-button type="primary" style="width:100%" @click="doLogin">登陆</el-button>
							</el-form>
						</el-col>
					</el-row>
					<h4 align="center" class="copyright">&copy; FAdmin</h4>
				</el-col>
			</el-row>

		</div>
	</body>
</html>
<script type="text/javascript">
var main = new Vue({
	el:"#main",
	data:{
		tips:"登陆到FAdmin",
		tipsClass:"tips-primary",
		code_img_src:"admin/login/checkVerify",
		form:{
			_token:"{{ csrf_token() }}",
			username:"",passwd:"",code:""
		}
	},
	methods:{
		changeVerify() {
			this.code_img_src = "admin/login/checkVerify?tm="+Math.random();
		},
		doLogin() {
			var param = this.form;
			$.post("admin/login/login",param,function(res) {
				if(res.code == 1){
					window.location.reload();
				}else{
					main.tipsClass = "tips-danger";
					main.tips = res.msg;
					main.form.code = '';
					main.changeVerify();
				}
			});
		},
		enterLogin(e) {
			if(e.keyCode == 13){
				this.doLogin();
			}
		}
	}
})
</script>
